//页面加载完成执行里面的代码
layui.use(['table', 'laypage'], function () {
    //对table重新赋值
    var laypage = layui.laypage;
    let table = layui.table;
    let form = layui.form;
    //渲染table数据
    // document.getElementById("")
    //完整功能
    page();


    //监听性别操作
    form.on('switch(sexDemo)', function (obj) {
        //需要对数据库的数据进行更新操作
        //调用ajax,以后我们每一次操作都应该用不同的方法
        let res = myAjax('/back/user/sex', {id: this.value}, 'post');
        if (res.count == 1) {
            layer.tips('修改性别成功');
        } else {
            layer.tips('修改性别失败');
        }

    });
    //监听状态操作
    form.on('enable(enableDemo)', function (obj) {
        console.log(111)

    });
    // //监听锁定操作
    form.on('checkbox(enableDemo)', function (obj) {
        let res = myAjax('/back/user/enable', {id: this.value}, 'post');
        if (res.count == 1) {
            layer.msg('修改状态成功', {icon: 6});
        } else {
            layer.msg('修改状态失败', {icon: 5});
        }
        // layer.tips(this.value + ' ' + this.name + '：' + obj.elem.checked, obj.othis);
    });
    //监听工具条
    table.on('tool(operate)', function (obj) {
        var data = obj.data;

        if (obj.event === 'detail') {
            layer.msg('ID：' + data.id + ' 的查看操作');
        } else if (obj.event === 'del') {

            layer.confirm('真的删除行么', function (index) {
                let res = myAjax('/back/user/delete', {id: data.id}, 'post');
                // $.ajax({
                //     url: '/back/user/delete',
                //     data: {id: data.id},
                //     type: 'post',
                //     dataType: 'json',
                //     success: function (res) {
                if (res.count == 1) {
                    obj.del();
                    layer.close(index);
                    layer.msg('已删除!', {icon: 1, time: 1000});
                    //删除后要刷新当前的数据
                    findAll({page: pageNo, limit: limit})
                } else {
                    layer.msg('删除失败!', {icon: 1, time: 1000});
                }
                // }
                // });

            });
        } else if (obj.event === 'edit') {
            //点击编辑
            // 1.应该弹出编辑页面，
            //2.要将编辑的信息输入编辑页面
            //考虑信息再那个地方来？
            // 1）.直接将当前数据传输到编辑页面（当前的数据和编辑页面的数据不一致）
            //2）可以只传递id，然后再编辑页面渲染完成后，根据id去数据库查询数据，然后将数据渲染到页面上
            //3.点击编辑时修改数据库的数据
            // layer.alert('编辑行：<br>' + JSON.stringify(data))
            // -----------------------------------
            //    怎么弹出页面？
            //我们需要将id传递到编辑页面？怎么传？
            //我们传递数据时，应该先传递数据还是先跳转页面？
            sessionStorage.setItem("userId", data.id);
            xadmin.open('编辑用户', './member-edit.html', 600, 400);
        } else if (obj.event === 'editpass') {
            sessionStorage.setItem("userId", data.id);
            //思考一个问题？
            // 1.这里的username会不会覆盖登录时传递的username？
            //2.再修改页面拿到的username会不会拿到登录时的username？
            sessionStorage.setItem("username", data.username);

            xadmin.open('修改密码', './member-password.html', 600, 400);
        }
    });
});
let pageNo = 1;
let limit = 10;

function page() {
    layui.use(['table', 'laypage'], function () {
        //对table重新赋值
        var laypage = layui.laypage;
        laypage.render({
            elem: 'page'
            , count: myAjax('/back/user/count', {}, 'get').count
            , layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip']
            , jump: function (obj) {

                pageNo = obj.curr;
                limit = obj.limit;
                findAll({page: pageNo, limit: limit});
            }
        });
    });
}

// function getCount() {
//     let result = null;
//     $.ajax({
//         url: '/back/user/count',
//         data: {},
//         type: 'get',
//         async: false,
//         dataType: 'json',
//         success: function (res) {
//             result = res.count;
//         }
//     });
//     return result;
// }

//对表格进行赋值：第几页和每一页显示多少天
//渲染表单数据
function findAll(data) {
    layui.use('table', function () {
        //对table重新赋值
        let table = layui.table;
        table.render({
            elem: '#table'//element
            , url: '/back/user/findAll'//调用后台数据,对于的是后台注解
            , cellMinWidth: 80
            , where: data
            , parseData: function (res) { //res 即为原始返回的数据

                return {
                    "code": res.code, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    "count": res.count, //解析数据长度
                    "data": res.data //解析数据列表
                };
            }
            , cols: [[//列
                {field: 'id', title: 'ID', sort: true}
                , {field: 'username', title: '用户名'}
                , {
                    field: 'sex', title: '性别', sort: true, templet: function (d) {
                        return '<div style="color: red;background-color: #00FFFF" onclick="changeSex(this,' + d.id + ')">' + d.sex + '</div>';
                    }
                }
                , {field: 'phone', title: '手机'}
                , {field: 'hobby', title: '爱好', minWidth: 150}
                , {field: 'enable', title: '状态', sort: true, templet: '#enable'}
                , {fixed: 'right', title: '操作', width: 300, align: 'center', toolbar: '#barDemo'}
            ]]
            // , page: true //开启分页
        });
    });
}

function changeSex(obj, id) {
    let res = myAjax('/back/user/sex', {id: id}, 'post');
    if (res.count == 1) {
        layer.tips('修改性别成功');
        //先拿到以前的值，根据以前的值，来重新显示数据
        $(obj).html($(obj).html() == '男' ? '女' : '男')
    } else {
        layer.tips('修改性别失败');
    }
}
